<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<script type="text/javascript">
	//初始化表单验证
	/* $("#addForm").validate({
		messages : {
			active_title : {
				required : "请输入活动标题"
			},
			start : {
				required : "请输入开始时间"
			},
			stop : {
				required : "请输入结束时间"
			}

		},
		submitHandler : function(form) {
			$(form).ajaxSubmit({
				success : function(data) {
					switch (data.flag) {
					case -1:
						Kit.alert("网络繁忙...，请重试");
						return;
					case 0:
						dataPaginators.loadPage(1);
						addDialog.close();
					}
				}
			});
		}
	}); */
</script>
<label class="search-label">商品名称:</label>
<input type="text" id="ftitle" value=""
	class="form-control search-input width140" maxlength="21"
	placeholder="请输入商品名">
<button class="btn btn-success search-btn" onclick="query2();queryEge();">确定</button>
<button class="btn btn-success search-btn" onclick="reset2();resetEge();">重置</button>



<div class="col-lg-6 col-lg-offset-6">
	<div class="pull-right">
		<button type="button" class="btn btn-success" onclick="doAddObject()">
			<span class="fa fa-save"></span>保存添加
		</button>
	</div>
</div>


<form id="addForm" action="${BASE_PATH}/spike/recommend/doAddObject"
	method="post" class="form-horizontal">
	<!-- <input type="hidden" name="saveId" value="id"> -->
	<div class="row">
		<div class="col-lg-12">
			<!-- <h1 class="page-header">添加商品</h1> -->
		</div>
		<!-- <div class="col-lg-6 col-lg-offset-6">
			<div class="pull-right">
				<button type="button" class="btn btn-success" onclick="toAddGoods()">
					<span class="fa fa-save"></span>保存添加
				</button>
			</div>
		</div> -->
	</div>
	<div class="row">
		<div class="col-lg-12">
			<div class="text-muted single-line-text pull-left">
				共 <font color="#428bca" id="dataCounts">0</font> 条记录
			</div>
		</div>
	</div>
	<input type="text" id="goodsType" name="goodsType" hidden="hidden" value ="">
	
	<!-- 点击切换按钮 -->
	<ul class="nav nav-tabs" role="tablist">
		<li role="presentation" class="active"><a href="#tab1" aria-controls="tab1" role="tab" data-toggle="tab" onclick="query2();">普通商品列表</a></li>
		<li role="presentation"><a href="#tab2" aria-controls="tab2" role="tab" data-toggle="tab" onclick="queryEge();">兑换商品列表</a></li>
	</ul>
	<!-- 分开展示列表 -->
<!-- 总表 -->
<div class="tab-content">
	<!-- 表一 -->
	<div role="tabpanel" class="tab-pane active container-fluid" id="tab1" style="padding-top:10px;">
		<div class="table-responsive">
			<table id="dataTable" class="table table-striped table-hover">
				<thead>
					<tr>
						<th width="50%">商品名称</th>
						<th width="20%">商品ID</th>
						<th width="20%">价格</th>
						<th width="10%">操作</th>
					</tr>
				</thead>
				<tbody id="dataLists">
				</tbody>
			</table>
		</div>
		<div class="row">
			<div class="col-lg-12">
				<ul id="dataPaginations" class="pagination-sm pull-right"></ul>
			</div>
		</div>
		<!-- 表一结束 -->
	</div>
	<!-- 表二 -->
	<div role="tabpanel" class="tab-pane" id="tab2" style="padding-top:10px;">
		<div class="table-responsive">
    		<table class="table ">
				 <thead>
		         	<tr>
						<th width="50%">商品名称</th>
						<th width="20%">商品ID</th>
						<th width="20%">价格</th>
						<th width="10%">操作</th>
		         	</tr>
		         </thead>
		         <tbody id="dataListsEge">
				</tbody>
			</table>
		</div>
		<div class="row">
			<div class="col-lg-12">
				<ul id="dataPaginationsEge" class="pagination-sm pull-right"></ul>
			</div>
		</div>
	<!-- 表二结束 -->
	</div>
	<!-- 总表结束 -->
</div>



<script type="text/html" id="datal">
		{{each list as item}}
	<tr id="item{{item.id}}" data-id="{{item.id}}">
		<td>{{item.name}}</td>
		<td>{{item.id}}</td>
		<td>{{item.sellPrice}}</td>
		<td><p><input type="checkbox" id="check" name="checkbox" value="{{item.id}}" ></p></td>
	</tr>
	{{/each}}
</script>
<script type="text/html" id="datalEge">
		{{each list as item}}
	<tr id="item{{item.id}}" data-id="{{item.id}}">
		<td>{{item.name}}</td>
		<td>{{item.id}}</td>
		<td>{{item.sellPrice}}</td>
		<td>
			<p>
				<input type="checkbox" id="check" name="checkbox" value="{{item.id}}" >
			</p>
		</td>
	</tr>
	{{/each}}
</script>
	<div class="row">
		<!--  <div class="col-lg-6">
			<button class="btn btn-primary col-sm-3 pull-right" type="submit"
				autocomplete="off">提交</button>
		</div>  -->
		<div class="col-lg-6">
			<button class="btn btn-default col-sm-3 pull-left" type="button"
				onclick="javascript:addDialog.close();" autocomplete="off">返回</button>
		</div>
	</div>
 

	<script type="text/javascript">

	/* 查询兑换商品 */
	var dataPaginatorsEge;
	$(queryEge);
	function queryEge() {
		//点击以后给goodsType赋值
		$('#goodsType').val('2');
		var pageSize=$("#pageSize").val();
		var params = {
			pageSize:pageSize,
			group:3,
			title:$("#ftitle").val()
		};
		if (dataPaginatorsEge) {
			dataPaginatorsEge.destroy();
		}
		dataPaginatorsEge = Kit.pagination("#dataPaginationsEge",
		"${BASE_PATH}/spike/recommend/OutSidePageEge", params, function(result) {
			//设置显示最新的数据数量
			$("#dataCounts").html(result.object.totalRow);
			//根据模板渲染数据并填充
			$("#dataListsEge").empty().append(
			template("datalEge", result.object));
		});
	}
	function resetEge() {
		$("#ftitle").val("");
	}
		var dataPaginators;
		$(query2);
		function query2() {
			//点击以后给goodsType赋值
			$('#goodsType').val('1');
			var pageSize=$("#pageSize").val();
			var params = {
				pageSize:pageSize,
				group:3,
				title:$("#ftitle").val()
			};
			if (dataPaginators) {
				dataPaginators.destroy();
			}
			//设置商品属性
			dataPaginators = Kit.pagination("#dataPaginations",
			"${BASE_PATH}/spike/recommend/OutSidePage", params, function(result) {
				//设置显示最新的数据数量
				$("#dataCounts").html(result.object.totalRow);
				//设置商品属性
				$("#dataLists").empty().append(
				template("datal", result.object));
			});
		}
		function reset2() {
			$("#ftitle").val("");
		}

		function doAddObject() {
			 $("#addForm").ajaxSubmit 
			({ 
				success : function(data) {
					switch (data.flag) {
					case -1:
						Kit.alert("网络繁忙...，请重试");
						return;
					case 0:
						Kit.alert("添加成功");
						window.location.reload();
					}
				}

			});

		}
		/* $('#控件id').find("li.active a").attr("属性值"); */
	</script>
		<input type="text" id="group" name="group" hidden="hidden" value ="${group}">
</form>

